<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Vue2.0源码解析</title>
</head>
<body>
  <div id="app">生命周期的合并</div>
  <script src="/dist/vue.js"></script>
  <script>
    // mergeOptions 实现原理
    Vue.mixin({
      a: 1,
      beforeCreated() { // 组件创建之前
        console.log('mixin-beforeCreated1');
      },
      created() { // 数据已经被劫持
        console.log('mixin-created1');
      },
    })
    Vue.mixin({
      b: 2,
      beforeCreated() { // 组件创建之前
        console.log('mixin-beforeCreated2');
      },
      created() { // 数据已经被劫持
        console.log('mixin-created2');
      },
    })
    const vm = new Vue({
      el: '#app',
      beforeCreated() { // 组件创建之前
        console.log('beforeCreated');
      },
      created() { // 数据已经被劫持
        console.log('created');
      },
    })
  </script>
</body>
</html>